<template>
  <div>
    <Card dis-hover>
      <Table :columns="checkTicketColumns" :data="checkTicketData"></Table>
    </Card>
    <Modal v-model="modalControl" :title="modalTitle">
      <p>请输您对【{{dealMes.invoice_title}}】的发票审核意见：</p>
      <br>
      <Input type="textarea" :rows="4" placeholder="处理意见。。。" v-model="view"></Input>
      <div slot="footer">
          <Button type="primary" size="small" @click="pass">审核通过</Button>
          <Button type="error" size="small"  @click="refuse">驳回</Button>
      </div>
    </Modal>
  </div>
</template>

<script>
export default {
  data () {
    return {
      checkTicketData:[],
      modalTitle:'',
      view:'',
      userName:'',
      dealMes:{},
      modalControl:false,
      checkTicketColumns:[
          {
            title:'名称',
            align:'center',
            key:'invoice_title'
          },{
            title:'税票类型',
            align:'center',
            key:'item_type'
          },{
            title:'开票金额(元)',
            align:'center',
            key:'invoice_amount'
          },{
            title:'开票日期',
            align:'center',
            key:'invoice_date'
          },{
            title:'对应客户',
            align:'center',
            key:'customer_name'
          },{
            title:'合同编号',
            align:'center',
            key:'contract_number'
          },{
            title:'客户经理',
            align:'center',
            key:'responsible_name'
          },{
          title:'操作',
          align:'center',
          render: (h,params) => {
            return h('div', [
                h('Tooltip', {
                  props: {
                    placement: 'top',
                    content: '详细信息'
                  }
                }, [h('Button', {
                  props: {
                    size: 'small',
                    icon: 'qr-scanner',
                    type: 'text'
                  },
                  on: {
                    click: () => {
                      this.$router.push({
                        name:'ticket_check-ticket-detail',
                        params:{id:params.row.invoice_id}
                      })
                    }
                  }
                })]),
                h('Tooltip', {
                  props: {
                    placement: 'top',
                    content: '处理'
                  }
                }, [h('Button', {
                  props: {
                    size: 'small',
                    icon: 'settings',
                    type: 'text'
                  },
                  on: {
                    click: () => {
                      this.dealHandle(params.row);
                    }
                  }
                }
                )])
              ]);
          }
        }],
    }
  },
  methods: {
    getChecks() {
      this.checkTicketData=[];
      // 财务专员的接口不相同
      if(this.userName === 'zhangyu') {
        this.$flowHttp.get('/flow/tasks?task=' + encodeURI('财务专员')).then((res) => {
          _.forEach(res.data.data,item => {
            if(item.form.category === 'invoice-approval') {
              item.form["task"]=item.taskId;
              this.checkTicketData.push(item.form)
            }
          })
        })
      }else {
        this.$flowHttp.get('/flow/tasks').then((res) => {
          _.forEach(res.data.data,item => {
            if(item.form.category === 'invoice-approval') {
              item.form["task"]=item.taskId;
              this.checkTicketData.push(item.form)
            }
          })
        })
      }
    },
    dealHandle(data) {
      this.modalTitle = "发票审核",
      this.modalControl = true
      this.dealMes = data
    },
    pass() {
      this.$flowHttp.post('/flow/process?task=' + this.dealMes.task,{'action':'PASS','comment':this.view}).then((res) => {
        this.$Message.info(res.data.message)
        this.getChecks()
      })
      this.modalControl = false
    },
    refuse() {
      this.$flowHttp.post('/flow/process?task=' + this.dealMes.task,{'action':'REJECT','comment':this.view}).then((res) => {
        this.$Message.info('您驳回了该条审核，该条审核将会重新回到申请人。')
        this.getChecks() 
      })
      this.modalControl = false
    }
  },
  mounted() {
    this.userName = this.$auth.user().name;
    this.getChecks()
  }
}
</script>

